/**
 * Affichage du tableau.
 */
function displayTreePanel(json) {
	
	$('#treePanel').empty(); 
	
	// Formatter de colonnes "seretide" avec icones
	function formatterIconSeretide(value) {
		var v = value + "";
		if (value >= 0) {
			return v + "&nbsp;&nbsp;<img src='img/cercle-vert.png' style='padding-right:5px;' />";
		} else if (value < -0.5) {
			return v + "&nbsp;&nbsp;<img src='img/cercle-rouge.png' style='padding-right:5px;' />";
		} else {
			return v + "&nbsp;&nbsp;<img src='img/cercle-jaune.png' style='padding-right:5px;' />";
		}
    }
	
	// Formatter de colonnes avec icones
	function formatterIconOthers(value) {
		var v = value + "";
		if (value >= 0) {
			return v + "&nbsp;&nbsp;<img src='img/cercle-rouge.png' style='padding-right:5px;' />";
		} else if (value < -0.5) {
			return v + "&nbsp;&nbsp;<img src='img/cercle-vert.png' style='padding-right:5px;' />";
		} else {
			return v + "&nbsp;&nbsp;<img src='img/cercle-jaune.png' style='padding-right:5px;' />";
		}
    }
	
	var allFields = new Array();
	allFields.push('typeSecto');
	allFields.push('secto');
	allFields.push('market');
	
	var prod = document.getElementById("productId");
	var options = prod.options;
	for (var i = 0; i < options.length; i++) {
		var productName = prod.options[i].text;
		if (productName != undefined) {
			allFields.push(productName);
			allFields.push(productName + 'Pm');
			allFields.push(productName + 'Delta');
		}
	}
	
	Ext.define('UGP', {
		extend : 'Ext.data.Model',
		fields : allFields
	});

	// Donnees JSON 
	var store = Ext.create('Ext.data.TreeStore', {
		model : 'UGP',
		root : json
	});
	
	var col = new Array();
	col.push({header: '', width: '0%', dataIndex: 'typeSecto', hidden: true});
	col.push({xtype : 'treecolumn', header: '', 				width: '15%',	dataIndex: 'secto' });
	col.push({						header: 'March&eacute;', 	width: '5%', 	dataIndex: 'market', align: 'center', filterable:true});
	
	var prod = document.getElementById("productId");
	var options = prod.options;
	
	for (var i = 0; i < options.length; i++) {
		var productName = prod.options[i].text;
		
		var colTmp = new Array();
		
		if (productName != undefined) {
			colTmp.push({header: 'UCD', 	dataIndex: productName,			align: 'center', sortable : true, filterable:true});
			colTmp.push({header: 'PM UCD', 	dataIndex: productName + 'Pm', 	align: 'center', sortable : true, filterable:true});
			if (productName == 'Seretide') {
				colTmp.push({header: '&Delta; PM UCD', dataIndex: productName + 'Delta', align: 'right', sortable : true, filterable:true,
					renderer: function(value, meta, record) {
						return formatterIconSeretide(value);
					}
				});
			} else {
				colTmp.push({header: '&Delta; PM UCD', dataIndex: productName + 'Delta', align: 'right', sortable : true, filterable:true,
					renderer: function(value, meta, record) {
						return formatterIconOthers(value);
					}
				});
			}
		}
		
		col.push({ text: productName, columns: colTmp });
	}
	
	// Creation de l'arbre 
	Ext.create('Ext.tree.Panel', {
		title : '',
		stripeRows: true, 
		height:260, 
		width:'100%', 
		border:false,
		renderTo : "treePanel",
		useArrows : true,
		rootVisible : false,
		store : store,
		multiSelect : true,
		singleExpand : true,
		columns : col
	});
}

/**
 * Chargement des données JSON pour l'affichage du tableau.
 */
function loadTreePanel() {
	
	var product   	= $('#productId').get(0).value;
	var periode   	= $('#periodId').get(0).value;
	var source	= $('#sourceId').get(0).value;
	var unite		= $('#unitId').get(0).value;
	var products   	= "";
	var prod 		= document.getElementById("productId");
	var options = prod.options;
	for (var i = 0; i < options.length; i++) {
		var productName = prod.options[i].text;
		if (productName != undefined) {
			products += productName + ";";
		}
	}
	
	$.ajax({ 
 		traditional: true, 
 		type: 'POST', 
 		url: './dataTable.do',
 		target: "_blank", 
 		data : {
 			product:    product,
 			periode:    periode,
 			source: source,
 			unite:		unite,
 			nivGeog:    globalNivGeog,
			geog:       globalGeog,
			filters:	filterGridArray,
			products:	products
 		}, 
 		error: function () {
 			alert('Erreur lors du chargement du tree panel'); 
 		},
 		success: function(result) { 
 			displayTreePanel(result.json);
 		}
 	});
	
}